import {Component, OnInit} from '@angular/core';
import {Hero} from './hero';
import {FormBuilder, FormGroup} from '@angular/forms';

@Component({
  selector: 'app-root',
  template: `
    <p>
    <input type="button" value="全选" (click)="AllSelect()"/>
    <input type="button" value="重置" (click)="AllSelectNull()"/>
    </p>
    <p>Result: {{result}}</p>
    <p *ngFor="let w of heroes">
      <label>
        <input #hh type="checkbox" [checked]='flag' (click)="selected(hh.checked,w.id,$event)"/>
        {{w.id}} {{w.name}}
      </label>
    </p>
  `,
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

  result = '';
  flag: boolean;
  selectedhero: Hero;
  heroes: Hero[] = [
    new Hero(1, 'dst'),
    new Hero(2, 'dst2'),
    new Hero(3, 'dst2'),
    new Hero(4, 'dst2'),


  ];
sArr: string[] = ['', '', '', ''];

  ngOnInit(): void {

  }

  AllSelect(): void {
    this.flag = true;
    this.sArr = ['1', '2', '3', '4'];
  }

  AllSelectNull(): void {
    this.flag = false;
    this.sArr = ['', '', '', ''];
  }

  selected(c: boolean, s: string): void {

    console.log('事件的值：' + c);

    this.result = s;
  }
}
